<template>
  <div>
    <el-form :model="queryCondition" ref="refQueryCondition" label-width="auto" style="width:100%;" size="small">
      <el-row>
        <el-col span="6">
          <el-form-item label="方案名称">
            <el-input v-model="batchInfo.name" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="项目名称:" prop="name">
            <el-input v-model="queryCondition.name" autocomplete="off" prefix-icon="el-icon-search"
                      placeholder="请输入评价名称" clearable />
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-button type="primary" style="margin-left:10px;" @click="loadDataList()" size="small">查询</el-button>
          <el-button type="success" style="margin-left:10px;" @click="save()" size="small" >保存</el-button>
        </el-col>
      </el-row>
      <el-row>
      </el-row>
    </el-form>
    <el-table
        v-loading="isLoading"
        :data="versionList"
        :key="'version_list'+type"
        tooltip-effect="dark"
        @row-click="handleClickRow"
        style="width: 100%"
        border
        row-key="id"
        highlight-current-row
        header-cell-style=""
        :row-key="(row)=>{return row.index}"
        @select="handleSelectionChange"
        @select-all="handleSelectAll"
        ref="multipleTable"
        :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
    >
      <el-table-column
          :reserve-selection="true"
          type="selection"
          :selectable="selectable"
          width="55">
      </el-table-column>
<!--      <el-table-column fixed width="60" type="index" label='序号'   align="left" >
        <template slot-scope="scope">
          {{scope.row.index}}
        </template>
      </el-table-column>-->
      <el-table-column prop="name" show-overflow-tooltip label="项目名称" />
      <el-table-column prop="year" show-overflow-tooltip width="100" label="项目年度" />
      <el-table-column prop="totalInvest" show-overflow-tooltip  label="建设投资" width="180" align="center" />
      <el-table-column prop="irrAfterTax" show-overflow-tooltip width="180" label="税后内部收益率" />
      <el-table-column prop="pbpAfterTax" show-overflow-tooltip width="180" label="税后投资回报期" />
      <el-table-column prop="npvAfterTax" show-overflow-tooltip width="180" label="税后财务净现值" />
    </el-table>
    <el-pagination
        style="text-align:center;padding-top:10px;"
        background
        @size-change="handlePageSizeChange"
        @current-change="loadDataList"
        :current-page="pageNo"
        :page-sizes="[10, 20, 30, 40,50,100]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="dataCount">
    </el-pagination>
  </div>
</template>
<script>
export default {
  $$route: {
    meta: {
      title: '版本锁定'
    }
  },
  name: "batchLock",
  data() {
    return {
      isLoading: false,
      versionList: [],
      queryCondition:{},
      pageNo:1,
      pageSize:20,
      dataCount:0,
      markVersion:[],
      markVersionMap:{},
      isInit: false,
      batchInfo:{}

    }
  },
  mounted() {
    this.loadDataList();
    this.loadBatchInfo();
  },
  methods: {
    save() {
      let markVersionList = Object.values(this.markVersionMap);
      let paramList = []
      for (let item of markVersionList) {
        let param = {
          'projectId' :item.projectId,
          'id':item.id
        }

        paramList.push(param)
      }
      this.$post("/compute_version/lock/",paramList,(res)=> {
        this.$message.success("保存成功")
        this.loadDataList(this.pageNo)
      })
    },
    loadBatchInfo:function(){
      this.editCommonDlgLoading = true;
      this.$get("/plan_info/info/"+this.$route.query.id, {}, (response) => {
        this.batchInfo = response.data;

      },()=>{
        this.editCommonDlgLoading = false;
      });
      this.editCommonDlgLoading = false;
    },
    handlePageSizeChange(size){
      this.pageSize = size;
      this.loadDataList(this.pageNo);
    },
    loadDataList(pageNo) {
      this.isLoading = true;
      if (!pageNo) {
        pageNo = 1;

      }
      this.pageNo = pageNo;
      let batchId = this.$route.query.id;
      this.queryCondition.pageNo = pageNo;
      this.queryCondition.pageSize = this.pageSize;
      this.queryCondition.batchId = batchId;

      this.$get("/compute_version/versionData/" , this.queryCondition, (res) => {
        let list = res.data;
        let index1 = 1;
        for(let item of list) {
          item.index = index1++;
          this.fixedData(item);
          let projectItemList = [];
          // let index2 = 1;
          if(item.children&&item.children.length>0) {
            let prefix = item.index + "."
            let childIndex = 1;

            for(let child of item.children) {
              this.fixedData(child);
              child.index = prefix+ childIndex;
             childIndex++;
              console.log(item.computeId ===child.id)
              if (item.computeId === child.id) {
                let map = this.markVersionMap;
                console.log(111111111111111111)
                this.markVersionMap[child.projectId] = child
              }
            }
          }
        }

          this.isInit = true
          this.toggleSelection(Object.values(this.markVersionMap))

        this.versionList = list
        this.dataCount = res.total;

      }, () => {
        this.isLoading = false;

      });
    },
    /**
     * 禁用全选和项目复选框
     * @param row
     * @param rowIndex
     * @returns {boolean}
     */
    selectable(row,rowIndex){
      if (row.children && row.children.length >0) {
        return false
      }
      return true;
    },
    fixedData(item){
      if(item.irrBeforeTax) {
        item.irrBeforeTax = item.irrBeforeTax.toFixed(2);
      }
      if(item.irrAfterTax) {
        item.irrAfterTax = item.irrAfterTax.toFixed(2);
      }
      if(item.npvBeforeTax) {
        item.npvBeforeTax = item.npvBeforeTax.toFixed(0);
      }
      if(item.npvAfterTax) {
        item.npvAfterTax = item.npvAfterTax.toFixed(0);
      }
      if(item.pbpBeforeTax) {
        item.pbpBeforeTax = item.pbpBeforeTax.toFixed(1);
      }
      if(item.pbpAfterTax) {
        item.pbpAfterTax = item.pbpAfterTax.toFixed(1);
      }
    },
    handleClickRow() {

    },
    handleSelectAll(rows){
      this.toggleSelection(rows,false)
      this.$message.warning("只允许选择评价版本")
    },
    handleSelectionChange(rows) {
        if (this.isInit || rows.length == 0) {
          return
        }
      let item = rows[rows.length - 1]
      let oldItem = this.markVersionMap[item.projectId]
      if (item.id == oldItem.id) {
        this.markVersionMap[item.projectId] = oldItem
        this.$refs['multipleTable'].toggleRowSelection(oldItem, true);
        return
      }
      this.$refs['multipleTable'].toggleRowSelection(oldItem, false);
      this.markVersionMap[item.projectId] = item
    },
    toggleSelection(rows,mark) {
      if (rows.length == 0) {
        return
      }
      if (mark==undefined) {
        mark = true
      }
      this.$nextTick( ()=> {
        if (rows) {
          for (let i = 0; i < rows.length; i++) {
            this.$refs['multipleTable'].toggleRowSelection(rows[i],mark);
          }
          this.isInit = false
        }
      })
    },
  }
}
</script>
<style>

.el-table__header-wrapper  .el-checkbox{
  display:none
}
</style>